<template>
  <div id="app">
    <router-view></router-view>
  </div>
</template>

<script>
  export default {}

  function responsive () {
    // 屏幕的宽度
    var screenWidth = window.innerWidth || document.documentElement.clientWidth

    if (screenWidth <= 320) {
      screenWidth = 320
    }
    if (screenWidth >= 750) {
      screenWidth = 750
    }
    // 希望把设计图分为15 rem ， 750的 设计；

    var count = 15

    // 设置html的字体大小； toFixed(number)  是保留几位小数
    // eslint-disable-next-line no-undef
    document.documentElement.style.fontSize = (screenWidth / count).toFixed(1) + 'px'
  }

  // 初始化加载调用
  responsive()

  // 监听屏幕变化调用
  window.addEventListener('resize', () => {
    responsive()
  })
</script>

<style lang="scss" scoped>
  #app{
    width: 100%;
    height: 100%;
    overflow: hidden;
  }
</style>
